---
title: Close Button
description: Used to trigger closing of dialogs, panels, and other components.
links:
  source: components/close-button
  storybook: components-close-button--basic
  recipe: close-button
---

<ExampleTabs name="close-button-basic" />

## Anatomy

```jsx
import { CloseButton } from '@saas-ui/react/close-button'
```

```jsx
<CloseButton />
```

## Examples

### Sizes

Use the `size` prop to change the size of the close button.

<ExampleTabs name="close-button-with-sizes" />

### Variants

Use the `variant` prop to change the appearance of the close button.

<ExampleTabs name="close-button-with-variants" />

### Custom Icon

Use the `children` prop to change the icon of the close button.

<ExampleTabs name="close-button-with-custom-icon" />

## Props

<PropTable component="Button" part="Button" />
